<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>完美电商</title>
    <!-- Bootstrap -->
    <link href="${pageContext.request.contextPath }/static/vendors/bootstrap/dist/css/bootstrap.min.css"
          rel="stylesheet">
    <!-- Font Awesome -->
    <link href="${pageContext.request.contextPath }/static/vendors/font-awesome/css/font-awesome.min.css"
          rel="stylesheet">
    <!-- NProgress -->
    <link href="${pageContext.request.contextPath }/static/vendors/nprogress/nprogress.css" rel="stylesheet">
    <!-- iCheck -->
    <link href="${pageContext.request.contextPath }/static/vendors/iCheck/skins/flat/green.css" rel="stylesheet">
    <!-- bootstrap-progressbar -->
    <link href="${pageContext.request.contextPath }/static/vendors/bootstrap-progressbar/css/bootstrap-progressbar-3.3.4.min.css"
          rel="stylesheet">
    <!-- JQVMap -->
    <link href="${pageContext.request.contextPath }/static/vendors/jqvmap/dist/jqvmap.min.css" rel="stylesheet"/>

    <!-- Custom Theme Style -->
    <link href="${pageContext.request.contextPath }/static/build/css/custom.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/static/plugins/kindeditor-4.1.10/themes/default/default.css"
          type="text/css" rel="stylesheet">
</head>

<body class="nav-md">
<div class="container body">
    <div class="main_container">
        <%@include file="/WEB-INF/jsps/menu.jsp" %>
        <!-- top navigation -->
        <%@include file="/WEB-INF/jsps/top.jsp" %>
        <!-- /top navigation -->

        <!-- page content -->
        <div class="right_col" role="main">
            <div class="x_panel">
                <div class="x_title">
                    <h2>修改商品基本信息
                        <small>修改商品基本信息</small>
                    </h2>
                    <div class="clearfix"></div>
                </div>
                <div class="x_content">
                    <form class="form-horizontal form-label-left" id="editForm" accept-charset="UTF-8">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3" for="first-name">商品分类 <span class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
                                <!-- Button trigger modal -->
                                <button type="button" class="btn btn-info" data-toggle="modal" data-target="#myModal">
                                    请选择
                                </button>
                                <input type="hidden" value="${productlist[0].pid}" name="pid"
                                       id="pid">
                                <input type="hidden" value="${productlist[0].cid}" name="cid" id="cid">
                                <span>${categoryList[0].cname}</span>

                                <input type="hidden" value="${requestScope.pageNum}" id="pageNum">
                                <input type="hidden" value="${requestScope.likeValue}" id="likeValue">
                                <!-- Modal -->
                                <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
                                     aria-labelledby="myModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal"
                                                        aria-label="Close"><span aria-hidden="true">&times;</span>
                                                </button>
                                                <h4 class="modal-title" id="myModalLabel">产品类别</h4>
                                            </div>
                                            <div class="modal-body">
                                                <div id="tree"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3" for="pname">商品名称 <span
                                    class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6">
                                <input type="text" id="pname" name="pname" required="required"
                                       value="${productlist[0].pname}" class="form-control col-md-7 col-xs-12">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3" for="ppoint">卖点 <span
                                    class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6">
                                <input type="text" id="ppoint" name="ppoint" required="required"
                                       value="${productlist[0].ppoint}" class="form-control col-md-7 col-xs-12">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3" for="price">价格 <span
                                    class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6">
                                <input type="text" id="price" name="price" required="required"
                                       value="${productlist[0].price}" class="form-control col-md-7 col-xs-12">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3" for="price">库存 <span
                                    class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
                                <!-- Button trigger modal -->
                                <button type="button" class="btn btn-info" data-toggle="modal"
                                        data-target="#mykuiModal">
                                    修改库存
                                </button>
                                <!-- Modal -->
                                <div class="modal fade" id="mykuiModal" tabindex="-1" role="dialog"
                                     aria-labelledby="myModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal"
                                                        aria-label="Close"><span aria-hidden="true">&times;</span>
                                                </button>
                                                <h4 class="modal-title">产品库存</h4>
                                            </div>
                                            <div class="modal-body">
                                                <c:forEach items="${listProductNum}" var="attributeList" varStatus="index">
                                                    <div class="form-group">
                                                        <label for="store" +index.count
                                                               class="col-sm-3 control-label">${attributeList.vname}</label>
                                                            <%--<input type="hidden" id="hideValue"+index.count name="hideValue"  value="${attributeList.storeNum}"  >--%>

                                                        <div class="col-sm-9">
                                                            <input type="hidden" name="vid" id="vid"
                                                                   value="${attributeList.vid}">
                                                            <input type="text" class="form-control" name="storeNum"
                                                                   value="${attributeList.storeNum}"
                                                                   id="store">
                                                        </div>
                                                    </div>
                                                </c:forEach>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                                                </button>
                                                <span id="tip"> </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="middle-name" class="control-label col-md-3 col-sm-3">商品图片</label>
                            <div class="col-md-2 col-sm-2">
                                <input type="button" id="J_selectImage" class="btn-info form-control col-md-2 col-xs-4"
                                       value="更改图片" style="margin-bottom: 10px;"/>
                                <img id="img_" width="50px" height="50px"
                                     src="${pageContext.request.contextPath}/product/showPic?pid=${productlist[0].pid}"/>
                            </div>
                            <div class="col-md-4 col-sm-4">
                                <div id="J_imageView" style="width: 50px;height: 50px"></div>
                                <input name="imgurl" type="hidden" id="imgurl" value="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="middle-name" class="control-label col-md-3 col-sm-3">商品说明*</label>
                            <div class="col-md-2 col-sm-2">
                        <textarea name="information" cols="100" rows="8"
                                  style="width: 700px; height: 200px; visibility: hidden;">${productlist[0].information}</textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-2 col-sm-2 col-md-offset-3">
                                <button type="button" id="btnEdit" class="btn btn-primary">修改</button>
                                <button type="reset" class="btn btn-primary">重置</button>
                            </div>
                        </div>
                    </form>

                </div>
            </div>

        </div>
        <!-- /page content -->
        <!-- footer content -->
        <%@include file="/WEB-INF/jsps/footer.jsp" %>
        <!-- /footer content -->
    </div>
</div>

<!-- jQuery -->
<script src="${pageContext.request.contextPath }/static/vendors/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="${pageContext.request.contextPath }/static/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- FastClick -->
<script src="${pageContext.request.contextPath }/static/vendors/fastclick/lib/fastclick.js"></script>
<!-- NProgress -->
<script src="${pageContext.request.contextPath }/static/vendors/nprogress/nprogress.js"></script>
<!-- KindEditor -->
<script src="${pageContext.request.contextPath}/static/plugins/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script src="${pageContext.request.contextPath}/static/plugins/kindeditor-4.1.10/lang/zh-CN.js"></script>
<!-- bootstrap-progressbar -->
<script src="${pageContext.request.contextPath }/static/vendors/bootstrap-progressbar/bootstrap-progressbar.min.js"></script>
<!-- iCheck -->
<script src="${pageContext.request.contextPath }/static/vendors/iCheck/icheck.min.js"></script>
<!-- Skycons -->
<script src="${pageContext.request.contextPath }/static/vendors/skycons/skycons.js"></script>
<!-- Custom Theme Scripts -->
<script src="${pageContext.request.contextPath }/static/build/js/custom.min.js"></script>
<script src="${pageContext.request.contextPath }/static/plugins/bootstrap-treeview20161102/js/bootstrap-treeview.js"></script>

<!-- 图片上传 -->
<script type="text/javascript">
    var itemAddEditor;
    //页面初始化完毕后执行此方法
    $(function () {
        //创建富文本编辑器
        itemAddEditor = KindEditor.create("#editForm [name=information]", {
            resizeType: 1,
            allowImageUpload: true,
            allowFileManager: true,
            uploadJson: '/product/uploadKindEditor.json',//服务器端提交的地址
            filePostName: 'file',//服务器端提交的文件名称
            afterUpload: function (url, data, name) {
                this.sync();//同步将富文本框中的内容同步到textarea
            }
        });
        <%--itemAddEditor.html(${productlist[0].ppoint});--%>
    });

    KindEditor.ready(function (K) {
        var editor = K.editor({
            filePostName: "file",//上传组件名
            uploadJson: '/product/uploadKindEditor.json',//上传地址
            dir: "image",//类型
            urlType: 'absolute'
        });
        K("#J_selectImage").click(function () {
            editor.loadPlugin('multiimage', function () {
                editor.plugin.multiImageDialog({
                    clickFn: function (urlList) {
                        var div = K('#J_imageView');
                        div.html('');
                        K.each(urlList, function (i, data) {
                            div.append('<img style="width:50px;height:50px;" src="' + data.url + '">');
                            K('#img_').attr('hidden', true);
                            K('#imgurl').attr('value', data.url);
                        });
                        editor.hideDialog();
                    }
                });
            });
        });
    });

    //分类树菜单
    var getTree = function () {
        $.ajax({
            url: "${pageContext.request.contextPath }/category/showCategory",//获取节点数据
            dataType: "json",
            success: function (data) {
                $('#tree').treeview({
                    data: data,//treeview控件绑定的数据
                    onNodeSelected: function (event, data) {
                        $('#cid').val(data.cid);
                        $('#cid').next('span').html(data.text);
                        $('#myModal').modal('hide');
                    }
                });
                $("#tree").treeview('collapseAll', {silent: true});
            },
        });
    };
    getTree();

    $(function () {
        $("#btnEdit").click(function () {
            itemAddEditor.sync();//同步富文本编辑框内容到textarea
            var decimalReg = /^\d{0,8}\.{0,1}(\d{1,2})?$/;
            var price = $("#price").val();
            var likeValue =$("#likeValue").val();
            var pageNum = $("#pageNum").val();
            if (!decimalReg.test(price)) {
                alert("价格请输入最多带两位数的值！");
                return false;
            }
            $.ajax({
                data: $('#editForm').serialize(),
                url: "${pageContext.request.contextPath}/product/producteditsubmit",
                dataType: "json",
                contentType: "application/json",
                success: function (data) {
                    if (data.code == 1) {
                        alert("更新成功！");
                        window.location.href = "${pageContext.request.contextPath}/product/listFuzzyProduct?likeValue=" + likeValue + "&pageNum=" + pageNum;
                    } else {
                        alert(data.msg);
                    }
                },
                error: function () {
                    alert("未知错误！");
                }
            });
        });
    });


</script>
</body>
</html>
